<template>
	<view class="loginContent">
		<view class="shuidi1">
			<view style="background-color: #d9ffff;" class="shuidi2"></view>
		</view>
		<view class="shuidi2">
			<view style="background-color: #d9ffff;" class="shuidi3"></view>
		</view>
		<view class="shuidi3">
			<view style="background-color: #d9ffff;" class="shuidi4"></view>
		</view>
		<view class="shuidi4">
			<view style="background-color: #d9ffff;" class="shuidi5"></view>
		</view>
		<view style="align-content: center;">
			<span class="denglu">小程序登陆</span>
		</view>
		
		<button type="primary" plain="true" @click="getUserInfo" open-type="getUserInfo" >微信一键登录</button>
		<button type="default" plain="true" @click="getExplain" >取消</button>
	</view>
</template>
<script>
	import {
		login
	} from "../../apis"
	export default {
		data() {
			return {
				obj: {
					code: '',
					encryptedData: '',
					iv: ''
				},
			}
		},
		onLoad() {
			console.log('进入login')
		// 	uni.showLoading({
		// 	    title: '加载中'
		// 	});
		// 	login(this.obj).then((res)=>{
		// 		let [err,data]=res 
		// 		console.log(data.data)
		// 	this.matchList = data.data.data
		// 	console.log(this.matchList)
		// 	uni.hideLoading();
		// })
	},
	methods: {
		getExplain(){
			uni.redirectTo({
			    url: '../explain/explain'
			});
		},
		getUserInfo() {
			uni.getProvider({
				service: 'oauth',
				success: function(res) {
					// console.log(res.provider)
					if (~res.provider.indexOf('weixin')) {
						uni.login({
							provider: 'weixin',
							success: function(loginRes) {
								console.log('微信登陆')
								console.log(loginRes)
								console.log(JSON.stringify(loginRes));
								//登录成功返回的code
								uni.getUserInfo({
									provider: 'weixin',
									success: function(infoRes) {
										console.log('用户昵称为：'+infoRes.userInfo.nickName)
										console.log('参数encryptedData为：'+infoRes.encryptedData)
										console.log('参数iv为：'+infoRes.iv)
										login({
											code: loginRes.code,
											encryptedData: infoRes.encryptedData,
											iv: infoRes.iv
										}).then((res) => {
											let [err, data] = res
											if(err!=null){
												console.log('请求错误')
												console.log(err)
											}
											
											console.log('请求成功')
											console.log(data)
											
											//存入token
											try {
											    uni.setStorageSync('exam-token', data.data.data);
												console.log('存入token成功');
												
												//跳转
												uni.switchTab({
												    url: '../index/index'
												});
											} catch (e) {
											    // error
												console.log('存入token失败');
												console.log(e.message);
											}
											
										})

									}
								});
							}
						});
					}
				}
			});


		},
		index(){
			console.log('555')
			uni.navigateTo({
			    url: '../grade/grade'
			});
		}
	}
	}
</script>

<style lang="scss" scoped>
	.userinfo-avatar {
		border-radius: 128rpx;
		width: 128rpx;
		height: 128rpx;
	}
	.loginContent{
		
		width: 100%;
		height: 800px;
		background-color: #1178ff;
		padding-top: 50px;
		padding-left: 10px;
		opacity: 0.2;
		
		.shuidi1{
			width: 100px;
			height: 100px;
			border-radius: 50%;
			background-color: #fcfcfc;
			box-shadow: 2px 2px 5px #ccc;
			margin-bottom: 5px;
			padding-left: 25px;
			margin-left: 258px;

		}
		.shuidi2{
			width: 80px;
			height: 80px;
			border-radius: 50%;
			background-color: #fcfcfc;
			box-shadow: 2px 2px 4px #ccc;
			margin-bottom: 5px;
			padding-left: 20px;
			margin-left: -20px;

		}
		.shuidi3{
			width: 60px;
			height: 60px;
			border-radius: 50%;
			background-color: #fcfcfc;
			box-shadow: 2px 2px 3px #ccc;
			margin-bottom: 5px;
			padding-left: 15px;
			margin-top: 49px;

		}
		.shuidi4{
			width: 40px;
			height: 40px;
			border-radius: 50%;
			background-color: #fcfcfc;
			box-shadow: 2px 2px 2px #ccc;
			margin-bottom: 5px;
			padding-left: 10px;
		}
		.shuidi5{
			width: 20px;
			height: 20px;
			border-radius: 50%;
			background-color: #fcfcfc;
			box-shadow: 2px 2px 2px #ccc;
			margin-bottom: 5px;
			padding-left: 5px;
		}
		button{
			color: #000;
			background-color: #fffff9;
			width: 50%;
			margin: 0 auto;
			letter-spacing: 2px;
			box-shadow: 3px 3px 3px #d9ffff;
			margin-bottom: 30px;
			font-weight: 900;
		}
		.denglu{
			font-weight: bold;
			font-size: 20px;
			margin-left: 150px;
			position: fixed;
			top: 94px;
			right: 49px;
			width: 10px;
		}
	}
</style>
